<template>
    <div>
      <home-header></home-header>
      <home-swiper :list="swiperList"></home-swiper>
      <home-icon :list="iconList"></home-icon>
      <home-recommend :list="recommendList"></home-recommend>
      <home-wenkend :list="weekendList"></home-wenkend>
    </div>
</template>
<script>
import HomeHeader from '../components/header'
import HomeSwiper from '../components/swiper'
import HomeIcon from '../components/icons'
import HomeRecommend from '../components/recommend'
import HomeWenkend from '../components/wenkend'
import axios from 'axios'
import {mapState} from 'vuex'
export default {
    name:"Home",
    components:{
        HomeHeader,
        HomeSwiper,
        HomeIcon,
        HomeRecommend,
        HomeWenkend
    },
    data(){
        return{
            // city:"",
            swiperList:[],
            recommendList:[],
            iconList:[],
            weekendList:[],
            lastCity:[]
        }
    },
    computed:{
        ...mapState(['city'])
    },
    methods:{
        getHomeInfo(){
            axios.get('/api/index.json?city='+this.city).then(this.getHomeInfoSucc)
        },
        getHomeInfoSucc(res){
            res=res.data;
            if(res.ret&&res.data){
                const data=res.data;
                // this.city=data.city;
                this.swiperList=data.swiperList;
                this.recommendList=data.recommendList;
                this.iconList=data.iconList;
                this.weekendList=data.weekendList;
            }
            console.log(res);
        }
    },
    mounted(){
        //AJAX数据的获取
        // console.log('mounted');
        this.lastCity=this.city
        this.getHomeInfo();
    },
    activated(){//当页面被重新显示
        // console.log('activated');
        if(this.lastCity!=this.city){
            this.lastCity=this.city;
            this.getHomeInfo();
        }
    }
}
</script>
<style>
</style>
